$view = $ 'body'
$gallary = $('.gallary', $view)
$trash = $('.trash', $view)
$tabs = $ '.tabs'


$('li', $gallary).draggable
    revert:'invalid'
    containment:'document'
    helper:'clone'
    curser:'move'

$gallary.droppable
    accept:'.trash li'
    activeClass:'ui-state-highlight'
    drop: (event, ui)->
        _reAddImage(ui.draggable)


_deleteImage= ($item)->
    $item.fadeOut ->
        $list = if $('ul', $trash).length then $('ul', $trash) else $("<ul class='gallery ui-helper-reset'/>").appendTo $trash
        $item.appendTo($list).fadeIn ->
            $item
            .animate({width:'100px', height:'100px'}, duration:300)
            
        $item.resizable ->
                containment: '.trash'

        $item.draggable
            revert:'invalid'
            containment:'document'
            helper:'clone'
            curser:'move'

_reAddImage = ($item)->
    $item.fadeOut ->
        $list = if $('ul', $gallary).lenght then $('ul', $gallary) else $('<ul>', class:"gallary, ui-helper-reset").appendTo $gallary
        $item.appendTo($list).fadeIn ->
            $item.animate({width:'250px', height:'250px'}, duration:300)
        

        $item.draggable
            revert:'invalid'
            containment:'document'
            helper:'clone'
            curser:'move'

$trash.droppable
    accept:'.gallary li'
    activeClass:'ui-state-highlight'
    drop: (event, ui)->
        _deleteImage(ui.draggable)


# $('ul', $gallary).accordion()


$tabs.tabs
    collapsible: true